<template>
  <view class="container">
    <view class="form">
      <text class="title">登录</text>
      <input class="input" placeholder="请输入用户名" v-model="username"/>
      <input class="input" placeholder="请输入密码" password v-model="password"/>
      <button class="btn" type="primary" @click="handleLogin">登录</button>
      <view class="link">
        <text>没有账号？</text>
        <navigator url="/pages/demos/register/register" open-type="navigate">去注册</navigator>
      </view>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      username: 'wht',
      password: '123456'
    }
  },
  methods: {
    handleLogin() {
      if (!this.username || !this.password) {
        uni.showToast({
          title: '请输入完整信息',
          icon: 'none'
        })
        return
      }
	  else{
		  if(this.username==="wht"&&this.password==="123456"){
		  		  uni.showToast({
		  		    title: '登录成功',
		  		    icon: 'success'
		  		  })
		  		  
		  		  setTimeout(() => {
		  		    uni.switchTab({
		  		      // url: "/pages/tabBar/tabcompage/tabcompage"
					  url: "/news_pages/Tabar/home/home"
		  		    })
		  		  }, 1500)
		   }
		  else{
		  		 uni.showToast({
		  		   title: '登录失败，账号或密码错误',
		  		   icon: 'error'
		  		 })
		  }
	  }
	  
    }
  }
}
</script>

<style>
.container {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 100vh;
  background-color: #f5f5f5;
}

.form {
  display: flex;
  flex-direction: column;
  width: 80%;
  padding: 40rpx;
  background-color: white;
  border-radius: 20rpx;
  box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.1);
}

.title {
  font-size: 48rpx;
  font-weight: bold;
  text-align: center;
  margin-bottom: 60rpx;
  color: #333;
}

.input {
  height: 80rpx;
  border: 2rpx solid #e0e0e0;
  border-radius: 10rpx;
  padding: 0 20rpx;
  margin-bottom: 30rpx;
  font-size: 28rpx;
}

.input:focus {
  border-color: #007AFF;
}

.btn {
  height: 80rpx;
  border-radius: 10rpx;
  margin-top: 20rpx;
  font-size: 32rpx;
  background-color: #007AFF;
}

.link {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 40rpx;
  font-size: 28rpx;
}

.link text {
  color: #666;
}

.link navigator {
  color: #007AFF;
  margin-left: 10rpx;
}
</style>